<template>
  <view class="index">
    <!-- 我的商品 -->
    <scroll-view :style="'height: calc(100vh - 160px)'" scroll-y="true" refresher-enabled="true" :refresher-triggered="triggered" refresher-background="" @refresherrefresh="onRefresh" @scrolltolower='lower'>
      <view v-if="unCheckList.length">
        <view class="order" v-for="(item,index) in unCheckList" :key="index">
          <view class="goodsItem">
            <view @click="goInfo(item.goodsId)">
              <u-image :showLoading="true" :src="item.urlLink" width="200rpx" height="200rpx" radius="10rpx"></u-image>
            </view>
            <view class="goodsInfo">
              <view class="dis_f_sb_c">
                <text style="color: #000;font-weight: 700;font-size:30rpx" class="wordLimit" @click="goInfo(item.goodsId)">{{item.name}}</text>
                <view class="m_t_5" style="color: #999;font-size: 24rpx;">{{item.createTimeStr}}</view>
              </view>
              <view class="dis_f_sb_c">
                <view>
                  <view class="tag-box" @click="goInfo(item.goodsId)">
                    <view class="one">
                      <u-tag :text="item.oneType" type="warning" plain size="mini"></u-tag>
                    </view>
                    <view class="one">
                      <u-tag :text="item.type" type="error" plain size="mini"></u-tag>
                    </view>
                    <u-tag :text="item.userVip" type="success" plain size="mini"></u-tag>
                  </view>
                  <!--                                    <view class="m_t_5" style="color: #999;font-size: 24rpx;">游戏ID: {{item.gameIdNo}}</view>-->
                  <!-- <view class="m_t_5" style="color: #999;font-size: 24rpx;">{{item.userVip}}</view> -->

                  <view class="m_t_5" style="color: #999;font-size: 24rpx;">区服: {{item.gameAreaType}}</view>
                  <view class="m_t_5" style="color: #999;font-size: 24rpx;" v-if="item.remark">备注: {{item.remark}}</view>
                </view>
              </view>

              <view class="goodsBottom">
                <view style="font-size: 24rpx;">佣金:
                  <text style="color: red;font-weight: 700;font-size: 32rpx;"> ¥<text style="margin-left: 10rpx;">{{item.fee}}</text></text>
                </view>
                <view class="btn" @click="handleExaminers(item.goodsOrderId)">立即抢单</view>
              </view>
            </view>
          </view>
        </view>
      </view>
      <s-empty v-else />
    </scroll-view>
  </view>
</template>

<script>
import { unCheckListApi, checkApi, putOrderCheckApi } from "@/sheep/api/index";
export default {
  data() {
    return {
      paramsPage: {
        pageNum: 1,
        pageSize: 10,
        city: null,
      },
      unCheckList: [],
      triggered: false,
      loadStatus: "",
      contentText: {
        contentdown: "查看更多",
        contentrefresh: "加载中",
        contentnomore: "没有更多了",
      },
    };
  },
  methods: {
    handleCall(phone) {
      uni.makePhoneCall({
        phoneNumber: phone,
      });
    },
    onShowAll() {
      this.onRefresh();
    },
    goInfo(goodsId) {
      uni.navigateTo({
        url: "/pages/index/info?goodsId=" + goodsId,
      });
    },
    handleExaminers(goodsOrderId) {
      putOrderCheckApi({ goodsOrderId: goodsOrderId }).then((res) => {
        if (res.code == 200) {
          uni.showToast({
            title: "操作成功",
            duration: 1500,
          });
        }
        this.onRefresh();
      });
    },
    getUnCheckList() {
      unCheckListApi(this.paramsPage).then((res) => {
        this.unCheckList = this.unCheckList.concat(res.rows);
        this.triggered = false;
        if (res.rows?.length < this.paramsPage.pageSize) {
          this.loadStatus = "noMore";
        } else {
          this.loadStatus = "more";
        }
      });
    },
    // 下拉刷新
    onRefresh() {
      this.triggered = true;
      this.unCheckList = [];
      this.paramsPage.pageNum = 1;
      this.getUnCheckList();
    },
    // 触底了
    lower() {
      if (this.loadStatus !== "noMore") {
        this.paramsPage.pageNum++;
        this.getUnCheckList();
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.index {
  padding: 30rpx;
  position: relative;
  z-index: 99;
  .order {
    margin-top: 30rpx;
    padding: 30rpx;
    background-color: #fff;
    border-radius: 20rpx;
    .item {
      display: flex;
    }
    .goodsItem {
      padding: 10rpx;
      display: flex;
      .goodsInfo {
        flex: 1;
        padding: 0 0 0 15rpx;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        .wordLimit {
          overflow: hidden;
          display: -webkit-box;
          -webkit-line-clamp: 2;
          /* 设置最大显示行数 */
          -webkit-box-orient: vertical;
          text-overflow: ellipsis;
        }
        .goodsBottom {
          display: flex;
          justify-content: space-between;
          align-items: center;
          .btn {
            background-color: #fa3534;
            color: #fff;
            width: 35%;
            border-radius: 10rpx;
            padding: 10rpx;
            font-size: 24rpx;
            text-align: center;
          }
        }
        .tag-box {
          display: flex;
          .one {
            margin-right: 10rpx;
          }
        }
      }
    }
  }
  .title {
    font-size: 30rpx;
    font-weight: 700;
    margin-bottom: 20rpx;
  }
}
</style>
